<include file="head"/>
<include file="menu"/>
<style type="text/css">
    .site-demo-upload img {
        width: 200px;
        height: 200px;
        border-radius: 100%;
    }

    #select_product_list p {
        font-size: 10px;
        color: blue;
        margin: 5px;
    }

    .layui-form-label {
        padding: 9px 2px;
    }

    .layui-table td, .layui-table th {
        padding: 9px 5px;
    }
</style>
<div class="content">
    <div class="search">
        <form action="{#:url('admin/User/index')#}" class="layui-form" method="get">
            <div class="layui-form-item">
                <label class="layui-form-label">昵称&nbsp;&nbsp;</label>
                <div class="layui-input-inline">
                    <input type="text" class="layui-input" name="nickname" value="{#$Think.get.nickname#}"
                           placeholder=""/>
                </div>
                <div class="layui-input-inline btnk">
                    <button class="layui-btn" lay-submit lay-filter="formSearch">搜索</button>
                </div>
            </div>
        </form>
    </div>
    <div class="list">
        <form action="" class="layui-form" method="post">
            <table class="layui-table">
                <thead>
                <tr>
                    <th>用户ID</th>
                    <Th>昵称</Th>
                    <Th>头像</Th>
                    <th>性别</th>
                    <th>城市</th>
                    <th>省份</th>
                    <th>积分</th>
                    <th>注册时间</th>
                    <!--<th>操作</th>-->
                </tr>
                </thead>
                <tbody>
                <volist name="list" id="val">
                    <tr>
                        <Td>{#$val.id#}</Td>
                        <td>{#$val.nickname#}</td>
                        <td><img src="{#$val.headimgurl#}" style="width:100px"/></td>
                        <Td>
                            <switch name="$val.sex" >
                                <case value="1">男</case>
                                <case value="2">女</case>
                                <default />未知
                            </switch>
                        </Td>
                        <td>{#$val.city#}</td>
                        <td>{#$val.province#}</td>
                        <td>{#$val.score#}</td>
                        <td>{#$val.created_at#}</td>
                        <!--<td>-->
                            <!--<a href="javascript:;" data-id="{#$val.id#}"-->
                               <!--class="layui-btn layui-btn-sm layui-btn-normal editp">编辑</a>-->
                        <!--</td>-->
                    </tr>
                </volist>
                <tr>
                    <td colspan="18" id="pageshow"></td>
                </tr>
                </tbody>
            </table>
        </form>
    </div>
</div>

<script>
    layui.use(['layer','form','laypage'], function() {
        var layer = layui.layer,laypage = layui.laypage,form=layui.form;
        // 分页
        laypage.render({
            elem: 'pageshow'
            ,count : {#$total#}
            ,limit: 10
            ,groups: 5 //连续显示分页数
            ,curr: function(){ //通过url获取当前页，也可以同上（pages）方式获取
                var page = location.search.match(/page=(\d+)/);
                return page ? page[1] : 1;
            }(),
            jump: function(e, first){ //触发分页后的回调
                if(!first){ //一定要加此判断，否则初始时会无限刷新
                    var page = location.search.match(/page=(\d+)/);
                    p = page ? page[1] : 1;
                    location.href= location.href.indexOf('page=')>0 ? location.href.replace('page='+p,'page='+ e.curr) : (location.href.indexOf('?')>0 ? location.href+'&page='+ e.curr : location.href+'?page='+ e.curr);
                }
            }
        });
    });
</script>
<include file="foot"/>